
<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>消失的导航</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="http://cdn.bootcss.com/twitter-bootstrap/3.0.3/css/bootstrap.min.css">


    <script src="http://cdn.bootcss.com/html5shiv/3.7.0/html5shiv.min.js"></script>
    <script src="http://cdn.bootcss.com/respond.js/1.3.0/respond.min.js"></script>




    <style type="text/css">
        .headroom {position: fixed;top: 0;left: 0;right: 0;transition: all .2s ease-in-out;}
        .headroom--unpinned {top: -100px;}
        .headroom--pinned {top: 0;}
    </style>

    <style type="text/css">
        .scrollspy-example {
            height: 1200px;
            overflow: auto;
            position: relative;
        }
    </style>
    <style>
        #img1{
            width: 1000px;
            height: 500px;
        }
        .img{
            width: 800px;
            height: 500px;
        }
    </style>
</head>
<body>
<div class="jumbotron">
    <div class="container" >
        <h1 style="font-family: 仿宋;color: #f50000">的社保费</h1>
        <img src="./img/1.bmp" id="img1"/>
    </div>
</div>

<div  class="container">
    <nav class="navbar navbar-inverse navbar-fixed-top" role="navigation" id="example">
        <div class="navbar-header">
            <a class="navbar-brand" href="#">首页</a>
        </div>

        <div class="collapse navbar-collapse" id="tem">
            <ul class="nav navbar-nav">
                <li class="active"><a href="#">团队</a></li>
                <li><a href="#">精品</a></li>
                <li class="dropdown">
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown">欣赏<b class="caret"></b></a>

                    <ul class="dropdown-menu">
                        <li><a href="#">www</a></li>
                        <li><a href="#">ssss</a></li>
                        <li><a href="#">ffff</a></li>
                    </ul>
                </li>
            </ul>
        </div>
    </nav>
</div>
<div style="margin-left: 100px">

</div>

<script src="http://cdn.bootcss.com/jquery/1.10.2/jquery.min.js"></script>

<script src="http://cdn.bootcss.com/twitter-bootstrap/3.0.3/js/bootstrap.min.js"></script>


<script  type="text/javascript"  src="https://rawgithub.com/WickyNilliams/headroom.js/master/dist/headroom.js"></script>

<script  type="text/javascript"  src="https://rawgithub.com/WickyNilliams/headroom.js/master/src/jQuery.headroom.js"></script>

<script type="text/javascript">

    $(".navbar-fixed-top").headroom();

</script>

</body>
</html>

